<template>
    <div class="mainWrap">
        <dl v-for="(v,i) in list" :key='i'>
            <dd>
                <h3>{{v.title}}</h3>
                <p>{{v.desc}}</p>
            </dd>
            <dt><img :src="v.url" alt=""></dt>
        </dl>
    </div>
</template>
<script lang='ts'>
import { Component, Vue } from 'vue-property-decorator';
import {getList} from "../../../api/index"

@Component
export default class index extends Vue {
    private list:any[]=[];
    async getListAndSet() {
        const resp=await getList()
        console.log(resp)
        this.list=resp.data.data
    }
    created(){
        this.getListAndSet()
    }
}
</script>
<style lang="scss" scoped>
    .mainWrap{
        width: 100%;
        height: 100%;
        padding: 0 12px;
    }
    dl{
        width: 100%;
        height: 100px;
        display: flex;
        margin: 10px 0;
        img{
            border-radius: 15px;
        }
        dd{
            flex: 1;
        }
    }
</style>